.-link {
  cursor: pointer;
  color: $blue;
}

/**测试
 */
.-t-bg1 {
  background-color: $orange;
}
.-t-bg2 {
  background-color: $green;
}
.-t-bg3 {
  background-color: $cyan;
}

/** flex布局相关
 * -flex、-flex-no-shrink
 * -flex-${justify-content}-${align-items}
 */
.-flex {
  display: flex;
}
.-flex-no-shrink {
  flex-shrink: 0;
}
@for $i from 1 through 10 {
  .-f#{$i} {
    flex: $i;
  }
}
// $justify-content-keys: fs, c, fe, sb, sa, se;
// $justify-content-values: flex-start, center, flex-end, space-between,
//   space-around, space-evenly;
// $align-items-keys: fs, c, fe, s, b;
// $align-items-values: flex-start, center, flex-end, stretch, baseline;
// @each $k1 in $justify-content-keys {
//   @each $k2 in $align-items-keys {
//     $i: index($justify-content-keys, $k1);
//     $j: index($align-items-keys, $k2);
//     .-flex-#{$k1}-#{$k2} {
//       display: flex;
//       justify-content: nth($justify-content-values, $i);
//       align-items: nth($justify-content-values, $j);
//     }
//     .-flex-#{$k1} {
//       display: flex;
//       justify-content: nth($justify-content-values, $i);
//     }
//     .-flex--#{$k2} {
//       display: flex;
//       align-items: nth($justify-content-values, $j);
//     }
//   }
// }

// $theme-colors: ("primary": $primary, "danger": $danger);
// @each $color, $value in $theme-colors {}
$justify-content-dict: (
  "fs": flex-start,
  "c": center,
  "fe": flex-end,
  "sb": space-between,
  "sa": space-around,
  "se": space-evenly,
);
$align-items-dict: (
  "fs": flex-start,
  "c": center,
  "fe": flex-end,
  "s": stretch,
  "b": baseline,
);
@each $justify-k, $justify-v in $justify-content-dict {
  @each $align-k, $align-v in $align-items-dict {
    .-flex-#{$justify-k}-#{$align-k} {
      display: flex;
      justify-content: $justify-v;
      align-items: $align-v;
    }
  }
  .-flex-#{$justify-k} {
    display: flex;
    justify-content: $justify-v;
  }
}
@each $align-k, $align-v in $align-items-dict {
  .-flex--#{$align-k} {
    display: flex;
    align-items: $align-v;
  }
}

/** 定位
 *
 */
.-pos-r {
  position: relative;
}
.-pos-a {
  position: absolute;
  left: 0;
  top: 0;
}
.-pos-f {
  position: fixed;
  left: 0;
  top: 0;
}

/** display
 *
 */
.-disp-b {
  display: block;
}
.-disp-i {
  display: inline;
}
.-disp-g {
  display: grid;
}


/** z-index
 */
.-z1 {
  z-index: 1;
}
.-z10 {
  z-index: 10;
}
.-z100 {
  z-index: 100;
}
.-z1000 {
  z-index: 1000;
}

/** 浮动
 */
.-float {
  float: left;
}
.-float-r {
  float: right;
}
.-clearfix::after {
  content: "";
  display: block;
  clear: both;
}

/** 颜色
 */
.-c0 {
  color: #000;
}
.-cf {
  color: #fff;
}
.-cc {
  color: #ccc;
}
.-c3 {
  color: #333;
}
.-c6 {
  color: #666;
}
.-c9 {
  color: #999;
}

/** 阴影
 */
.-shadow {
  box-shadow: 0 5px 18px -5px rgba(0, 0, 0, 0.08);
}

/** 边距, 圆角
 */
.-mg0 {
  margin: 0;
}
.-pd0 {
  padding: 0;
}
$direct: (
  "t": "top",
  "r": "right",
  "b": "bottom",
  "l": "left"
);
@each $d, $dd in $direct {
  @for $i from 1 through 4 {
    .-mg#{$d}_#{$i}0 {
      margin-#{$dd}: $i * 10px;
    }
    .-pd#{$d}_#{$i}0 {
      padding-#{$dd}: $i * 10px;
    }
  }
}
.-radius50p {
  border-radius: 50%;
}
.-radius2 {
  border-radius: 2px;
}
.-radius4 {
  border-radius: 4px;
}
.-radius6 {
  border-radius: 6px;
}
.-radius8 {
  border-radius: 8px;
}
.-radius10 {
  border-radius: 10px;
}

/** 尺寸
 */
.-h0 {
  height: 0;
}
.-h100p {
  height: 100%;
}
.-w0 {
  width: 0;
}
.-w10p {
  width: 10%;
}
.-w20p {
  width: 20%;
}
.-w30p {
  width: 30%;
}
.-w33p {
  width: 33.33%;
}
.-w100p {
  width: 100%;
}

/** 文本相关
 *
 */
/* 当前节点 */
.-ellipsis {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
/* 子节点 */
@mixin ellipsis {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.-ellipsis1 {
  @include ellipsis;
  -webkit-line-clamp: 1;
  white-space: break-all;
}
.-ellipsis2 {
  @include ellipsis;
  -webkit-line-clamp: 2;
  word-break: break-all;
}
.-ellipsis3 {
  @include ellipsis;
  -webkit-line-clamp: 3;
  word-break: break-all;
}
.-no-wrap {
  white-space: nowrap;
}
.-word-break {
  word-break: break-all;
  word-wrap: break-word;
}
.-fw700 {
  font-weight: 700;
}
.-fs1rem {
  font-size: 1rem;
}
.-fs1_2rem {
  font-size: 1.2rem;
}
.-fs1_5rem {
  font-size: 1.5rem;
}
.-fs2rem {
  font-size: 2rem;
}
.-fs12 {
  font-size: 12px;
}
.-fs14 {
  font-size: 14px;
}
.-fs16 {
  font-size: 16px;
}
.-fs18 {
  font-size: 18px;
}
.-fs20 {
  font-size: 20px;
}
.-fs22 {
  font-size: 22px;
}
.-fs24 {
  font-size: 24px;
}

/** 鼠标
 */
.-pointer {
  cursor: pointer;
}

/** 图片
 */
.-img-contain {
  object-fit: contain;
}
.-img-scale {
  object-fit: scale-down;
}
.-img-cover {
  object-fit: cover;
}
